<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('机器授权列表')" />
    <style type="text/css">
   		.layui-col-md12 {margin-bottom:10px;}
        .layui-col-sm4 {width:20%;min-width:350px !important}
        .layui-form{}
        .layui-input{width:240px}
        .layui-elem-quote{padding:0}
        .layui-table-page{padding:2px 7px 0;height:30px;}
        #layui-table-page1{display: flex;justify-content: flex-end;}
        #layui-table-page2{display: flex;justify-content: flex-end;}
        .layui-card-header{padding:0}
        .layui-elem-quote{border:none;}
        .left-title-div{height:55px;line-height:55px;}
        .layui-col-md12:nth-child(1) .left-title-div{background-color:rgba(79,192,232,0.2);}
        .layui-col-md12:nth-child(2) .left-title-div{background-color:rgba(164,160,211,0.2);}
        .left-title{text-align:center;font-weight: 700;color: #142a48;font-size:21px;}
        #btn-search1,#btn-search2{height:32px;line-height:32px;padding:0 6px;font-size:14px;}
        #btn-reset1,#btn-reset2{height:32px;line-height:32px;padding:0 6px;font-size:14px;background-color:#f2f2f2;}
        #btn-reset1 .fa_span,#btn-reset2 .fa_span{color:#142A48;}
        .layui-btn+.layui-btn {margin-left: 7px;}
        .flex-rt{display: flex;justify-content: flex-end;align-items: center;flex-wrap: wrap;}
        .layui-laypage-em{background-color:#1890FF;}
        .layui-table-body {position: relative;overflow: auto;margin-right: -1px;margin-bottom: 5px;}
        .layui-laypage .layui-laypage-curr .layui-laypage-em {background-color: #1890FF;}
        .layui-form-label{color:#142A48;}
        .layui-icon{display:none;}
        .layui-elem-quote::before{background-color: #fff;}
        .layuiadmin-card-header-auto{padding: 15px 0 !important}
    </style>
</head>
<body style="background-color: #e4e6e9;">
<div class="main-content">
    <div class="mid-content">
        <div class="layui-col-md12">
            <blockquote class="layui-elem-quote" style="padding: 0px 10px;">
                <div class="left-title-div"><p class="left-title">待 授 权 机 器 列 表</p></div>
                <div class="north-content" style="background-color: #fff">
                    <form class="layui-form dis-ctr" >
                        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
                            <div class="layui-form-item flex-rt" style="margin-top: 0px">
                                <div class="layui-inline layui-col-sm4">
                                    <label class="layui-form-label">登陆IP：</label>
                                    <div class="layui-input-block">
                                        <input id="ip-kw1" type="text" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-sm4">
                                    <label class="layui-form-label">计算机名：</label>
                                    <div class="layui-input-block">
                                       <input id="hostname-kw1" type="text" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <a class="layui-btn layuiadmin-btn-order dhicon dh-search" id="btn-search1"><span class="fa_span">查询</span></a>
                                    <button type="reset" class="layui-btn layui-btn-primary dhicon dh-refresh" id="btn-reset1"><span class="fa_span">重置</span></button>
                                </div>
                            </div>
                			<table class="layui-inline layui-hide" id="dhtable1" lay-filter="ftable1"></table>
                        </div>
                    </form>
                </div>
            </blockquote>
        </div>
        <div class="layui-col-md12">
            <blockquote class="layui-elem-quote" style="padding: 0px 10px;">
                <div class="left-title-div"><p class="left-title">已 授 权 机 器 列 表</p></div>
                <div class="north-content" style="background-color: #fff">
                    <form class="layui-form dis-ctr" >
                        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
                            <div class="layui-form-item flex-rt" style="margin-top: 0px">
                                <div class="layui-inline layui-col-sm4">
                                    <label class="layui-form-label">登陆IP：</label>
                                    <div class="layui-input-block">
                                        <input id="ip-kw2" type="text" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-sm4">
                                    <label class="layui-form-label">计算机名：</label>
                                    <div class="layui-input-block">
                                       <input id="hostname-kw2" type="text" autocomplete="off" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <a class="layui-btn layuiadmin-btn-order dhicon dh-search" id="btn-search2"><span class="fa_span">查询</span></a>
                                    <button type="reset" class="layui-btn layui-btn-primary dhicon dh-refresh" id="btn-reset2"><span class="fa_span">重置</span></button>
                                </div>
                            </div>
                			<table class="layui-inline layui-hide" id="dhtable2" lay-filter="ftable2"></table>
                        </div>
                    </form>
                </div>
            </blockquote>
        </div>
    </div>
</div>
<th:block th:include="include :: footer" />
<script type="text/html" id="barDh1">
    <a class="layui-btn layui-btn-xs dhicon dh-play-circle-o layui-btn-normal" lay-event="auth"  shiro:hasPermission="system:hardwareauth:edit"> 机器授权</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs dhicon dh-remove" lay-event="delete1" shiro:hasPermission="system:hardwareauth:delete"><span class="fa_span">删除待授权</span></a>
</script>
<script type="text/html" id="barDh2">
    <a class="layui-btn layui-btn-danger layui-btn-xs dhicon dh-remove" lay-event="delete2" shiro:hasPermission="system:hardwareauth:delete"><span class="fa_span">取消授权</span></a>
</script>
<script th:inline="javascript">
    /*<![CDATA[*/
    var prefix = ctx + "system/hardwareauth";
    /*]]>*/
</script>
<script type="text/javascript">
    layui.use(['laydate', 'table','form','layer','jquery'], function () {
        var $ = layui.$,layer = layui.layer,form = layui.form,table = layui.table,laydate = layui.laydate;
        var tableH=$(window).height()/2 - 0;
        $.tablelist.init({
            elem: '#dhtable1'
            ,modalName: "待授权列表"
            ,url: prefix + "/unreglist"
            ,initSort: {field: 'registerTime',type: 'desc'}
            ,where: {
                field: 'registerTime' //排序字段
                ,order: 'desc' //排序方式
            }
            ,sort:true
            ,cols: [[
                {type:'numbers',title:''},
                {field: 'id',title: 'id',hide:true},
                {field: 'hostIP',title: '登录IP地址',width:140, sort: true},
                {field: 'hardInfo',title: '硬件信息',width:420, sort: true},
                {field: 'hostName',title: '计算机名',width:180, sort: true},
                {field: 'registerTime',title: '操作时间',width:170, sort: true},
                {field: 'loginTime',title: '登录时间',width:170, sort: true},
                {title: '操作',width:230,align: 'center',templet:'#barDh1'}
            ]
            ]
            ,height:tableH - 190
        });
        //监听工具条
        table.on('tool(ftable1)', function (obj) {
            var data = obj.data;
            switch(obj.event){
                case 'delete1':
                    $.operate.remove("确定要删除待授权数据吗？",prefix + "/unregdelete",{'id':data.id},function(result){
                        allReload1(result);
                    });
                    break;
                case 'auth':
                    $.operate.remove("确定要授权此机器吗？",prefix + "/authpost",{'unId':data.id},function(result){
                        allReload1(result);
                        allReload2(result);
                    });
                    break;
            }
        });
        //监听排序事件
        table.on('sort(ftable1)', function(obj){
            $.tablelist.sort('dhtable1',obj);
        });
        var active1 = {
            reload: function (formData) {
                table.reload('dhtable1', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                    where:{
                        hostIp:$("#ip-kw1").val(),
                        hostName:$("#hostname-kw1").val()
                    }
                });
            },
        };
        $('#btn-search1').on('click', function () {
            active1['reload'].call(this);
        });
        //重新加载
        function allReload1(result){
            if(result.code==0){
                setTimeout(function(){
                    layer.closeAll();
                    table.reload('dhtable1', {url: prefix + "/unreglist",page:{curr: 1}});
                }, 1000);
            }
        }
        //已授权列表
        $.tablelist.init({
            elem: '#dhtable2'
            ,modalName: "已授权列表"
            ,url: prefix + "/reglist"
            ,initSort: {field: 'registerTime',type: 'desc'}
            ,where: {
                field: 'registerTime' //排序字段
                ,order: 'desc' //排序方式
            }
            ,sort:true
            ,cols: [[
                {type:'numbers',title:''},
                {field: 'id',title: 'id',hide:true},
                {field: 'hostIP',title: '登录IP地址',width:140, sort: true},
                {field: 'hardInfo',title: '硬件信息',width:420, sort: true},
                {field: 'hostName',title: '计算机名',width:180, sort: true},
                {field: 'registerTime',title: '操作时间',width:170, sort: true},
                {field: 'loginTime',title: '登录时间',width:170, sort: true},
                {title: '操作',width:180,align: 'center',templet:'#barDh2'}
            ]
            ]
            ,height:tableH
        });
        //监听工具条
        table.on('tool(ftable2)', function (obj) {
            var data = obj.data;
            switch(obj.event){
                case 'delete2':
                    $.operate.remove("确定要取消授权数据吗？",prefix + "/regdelete",{'id':data.id},function(result){
                        allReload2(result)
                    });
                    break;
            }
        });
        //监听排序事件
        table.on('sort(ftable2)', function(obj){
            $.tablelist.sort('dhtable2',obj);
        });
        var active2 = {
            reload: function (formData) {
                table.reload('dhtable2', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                    where:{
                        hostIp:$("#ip-kw2").val(),
                        hostName:$("#hostname-kw2").val()
                    }
                });
            },
        };
        $('#btn-search2').on('click', function () {
            active2['reload'].call(this);
        });
        //重新加载
        function allReload2(result){
            if(result.code==0){
                setTimeout(function(){
                    layer.closeAll();
                    table.reload('dhtable2', {url: prefix + "/reglist",page:{curr: 1}});
                }, 1000);
            }
        }
    })
</script>
</body>
</html>